<template>
  <div class="list_item">
    <div class="left">
      <img :src="item.imgUrl" alt>
    </div>
    <div class="right">
      <p>{{item.title}}</p>
      <b>￥:{{item.pic}}</b>
    </div>
  </div>
</template>
<script>
export default {
  props: ["item"],
  components: {},
  data() {
    return {};
  },
  computed: {},
  methods: {},
  created() {},
  mounted() {}
};
</script>
<style scoped lang="">
.list_item {
  width: 100%;
  height: 120px;
  margin-top: 10px;
  display: flex;
}
.list_item .left {
  flex: 3;
  height: 100%;
}
.list_item .left img {
  width: 100%;
  height: 100%;
}
.list_item .right {
  flex: 7;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.list_item .right p {
  flex: 1;
}
.list_item .right b {
  color: red;
}
</style>
